<template>
  <div>
    <input v-bind:value="inputVal" />
    <input :value="inputVal" />
    <!-- <input :value="inputVal" @value="updateValue"/> -->

    <button @click="clickHandler">点击</button>

    <input v-model="inputVal" />

    <input v-if="false" />
    <input v-else />

    <input v-show="false" />

    <p v-for="item in 3" :key="item">{{ item }}</p>

    <!-- 外部父组件调用 -->
    <my-button @click="btnClick"></my-button>
  </div>
</template>
<script>
export default {
  props: {
    text: {
      type: String,
      default: "默认值",
    },
  },
  data() {
    return {
      inputVal: "",
    };
  },
  methods: {
    ClickHandler() {
      //console.log("按钮点击事件")
      this.$emit("click");
    },
  },
  computed: {
    test() {
      return this.inputVal + "1";
    },
  },
};
</script>